import {
  ChangeDetectionStrategy,
  ChangeDetectorRef,
  Component,
  ElementRef,
  EventEmitter,
  Input,
  OnInit,
  Output,
  Renderer2,
  SimpleChanges,
  TemplateRef,
  ViewChild,
} from '@angular/core';
import { DialogConfigService } from '../../services/dialog-config.service';

@Component({
  selector: 'app-dialog-custom',
  templateUrl: './dialog-custom.component.html',
  styleUrls: ['./dialog-custom.component.less'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DialogCustomComponent implements OnInit {
  @Input() title!: TemplateRef<any>;
  @Input() content!: TemplateRef<any>;
  @Input() footer!: TemplateRef<any>;
  // 服务里面的值
  @Input() titlePos: string = 'center';
  @Input() width: string = '50%';
  @Input() visible: boolean = false;
  /**
   * containerPos取值：
   * center       中间
   * topCenter    上中
   * topLeft      上左
   * bottomLeft   下左
   * bottomCenter 下中
   */
  @Input() containerPos: string = 'center';
  @Output() ngOnCancel = new EventEmitter();
  @ViewChild('container', { static: false }) container!: ElementRef;
  config!: DialogConfigService;
  constructor() {
    this.config = new DialogConfigService();
  }

  ngOnInit() {}
  ngOnChanges(changes: SimpleChanges): void {
    this.config.setShow = this.visible;
    this.config.setTitlePos = this.titlePos;
    this.config.setWidth = this.width;
    this.config.setContainerPos = this.containerPos;
  }
  ngAfterViewInit(): void {
    console.log(this.container);
  }
  closeDialog() {
    this.ngOnCancel.emit();
  }
}
